﻿<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
	<meta charset="utf-8" />
    <script src="../0_System_file/js/jquery.min.js"></script>
    <script src="../0_System_file/js/jquery.easyui.min.js"></script>
    <script src="../0_System_file/js/validatebox.js"></script>
    <link href="../0_System_file/themes/default/easyui.css" rel="stylesheet" />
    <link href="../0_System_file/themes/icon.css" rel="stylesheet" />
    <link href="../0_System_file/themes/Site (1).css" rel="stylesheet" />
    <style type="text/css">
        #bb {
            width: 1000px;
            height: 50px;
            border: 1px solid green;
        }

        #ee {
            width: 1000px;
            height: 130px;
            margin-top: 5px;
            border: 1px solid green;
        }

        #ff {
            width: 1000px;
            height: 180px;
            margin-top: 25px;
            border: 1px solid green;
        }
    </style>
</head>
<body>
    <div id="bb">
        &nbsp;&nbsp;&nbsp;&nbsp;<b style="font-size:16px;margin-top:-5px;">查询</b><br />
        &nbsp;&nbsp;&nbsp;&nbsp;消费日期:<input id="dd" type="text" style="width:90px;">&nbsp;&nbsp;<input id="ss" style="width:60px;">
        &nbsp;&nbsp;&nbsp;&nbsp;至:<input id="d1" type="text" style="width:90px;">&nbsp;&nbsp;<input id="s1" style="width:60px;">卡号/手机:<input type="text" id="phone" />&nbsp;&nbsp;&nbsp;&nbsp;
        消费类型:<select id="cc" style="width:100px;"></select>
        <div id="sp">
            <div style="padding:10px;">
                <input type="radio" name="lang" value="01" /><span>不限消费</span><br />
                <input type="radio" name="lang" value="02" /><span>类型2</span><br />
                <input type="radio" name="lang" value="03" /><span>类型3</span><br />
            </div>
        </div>
        <input id="select" type="button" value="查询" style="background:#0094ff;" /><br />

    </div>
    <div id="ee">
        <table id="dg" style="padding-left:100px;width:1000px; height:130px;"></table>
        <b style="color:#ff0000;">总计金额合计:</b>
    </div>
    <div id="ff">
        <table id="dg1" style="padding-left:100px; width:1000px; height:180px;"></table>
        <b style="color:#ff0000;">总计金额合计:</b>
    </div>
    <script type="text/javascript">
        $('#dd').datebox({
            required: true
        });
        $('#d1').datebox({
            required: true
        });
        $('#ss').timespinner({
            min: '08:30',
            required: true,
            showSeconds: true
        });
        $('#s1').timespinner({
            min: '08:30',
            required: true,
            showSeconds: true
        });
        $('#cc').combo({
            required: true,
            editable:false
        });
        $('#sp').appendTo($('#cc').combo('panel'));
        $('#sp input').click(function () {
            var v = $(this).val();
            var s = $(this).next('span').text();
            $("#cc").combo('setValue', v).combo('setText', s).combo('hidePanel');
        });
        $('#dg').datagrid({
            url: "/10_Json/datagrid_data1.json",
            rownumbers: true,//添加序列号
            pagination: true,
            method: "get",
            columns: [[
                { field: "productid", title: "商铺ID", width: 100 },
               { field: "productname", title: "商铺名称", width: 100 },
               { field: "unitcost", title: "价格", width: 100 }
            ]]
        });
        $('#dg1').datagrid({
            url: "/10_Json/datagrid_data1.json",
            rownumbers: true,//添加序列号
            pagination: true,
            method: "get",
            columns: [[
                { field: "productid", title: "商铺ID", width: 100 },
               { field: "productname", title: "商铺名称", width: 100 },
               { field: "unitcost", title: "价格", width: 100 }
            ]]
        });
    </script>
</body>
</html>
